<template>
  <view class="agreement-page">
    <!-- 协议标题 -->
    <view class="agreement-header">
      <text>{{agreementTitle}}</text>
    </view>
    
    <!-- 协议内容 -->
    <scroll-view class="agreement-content" scroll-y>
      <rich-text :nodes="agreementContent"></rich-text>
    </scroll-view>
    
    <!-- 同意按钮 -->
    <view class="agree-btn" @click="goBack">
      <text>我已阅读并同意</text>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      agreementTitle: '',
      agreementContent: '',
      type: '' // user: 用户协议, privacy: 隐私政策
    }
  },
  onLoad(options) {
    this.type = options.type || 'user'
    this.setAgreementContent()
  },
  methods: {
    setAgreementContent() {
      if (this.type === 'user') {
        this.agreementTitle = '用户协议'
        this.agreementContent = `
          <h3>一、总则</h3>
          <p>1. 本协议是您与本公司之间关于使用本服务所订立的协议。</p>
          <p>2. 本协议内容包括协议正文及所有本公司已经发布的或将来可能发布的各类规则。</p>
          
          <h3>二、服务内容</h3>
          <p>1. 本公司通过互联网为您提供商品展示、交易等服务。</p>
          <p>2. 您在使用本服务时，应自行准备相关设备并承担费用。</p>
          
          <h3>三、用户账号</h3>
          <p>1. 您注册成功后，将获得一个用户账号及相应的密码。</p>
          <p>2. 您应妥善保管账号及密码，并对其使用行为承担法律责任。</p>
          
          <h3>四、用户行为规范</h3>
          <p>1. 您承诺遵守法律法规及社会公德。</p>
          <p>2. 您不得利用本服务从事任何违法或不正当的活动。</p>
          
          <h3>五、免责声明</h3>
          <p>1. 本公司不保证服务一定能满足您的要求。</p>
          <p>2. 因不可抗力导致服务中断，本公司不承担任何责任。</p>
        `
      } else {
        this.agreementTitle = '隐私政策'
        this.agreementContent = `
          <h3>一、信息收集</h3>
          <p>1. 我们收集您的个人信息以提供更好的服务。</p>
          <p>2. 我们收集的信息包括但不限于姓名、电话、地址等。</p>
          
          <h3>二、信息使用</h3>
          <p>1. 我们使用您的信息来提供、维护和改进服务。</p>
          <p>2. 我们可能使用您的信息发送重要通知。</p>
          
          <h3>三、信息披露</h3>
          <p>1. 未经您同意，我们不会向第三方披露您的信息。</p>
          <p>2. 根据法律法规要求披露的情况除外。</p>
          
          <h3>四、信息安全</h3>
          <p>1. 我们采取各种安全措施保护您的信息。</p>
          <p>2. 请您妥善保管账号密码，避免信息泄露。</p>
          
          <h3>五、政策变更</h3>
          <p>1. 本政策可能会不时更新。</p>
          <p>2. 我们会通过适当方式通知您重大变更。</p>
        `
      }
    },
    goBack() {
      uni.navigateBack()
    }
  }
}
</script>

<style>
.agreement-page {
  height: 100vh;
  display: flex;
  flex-direction: column;
  background-color: #fff;
}
.agreement-header {
  height: 100rpx;
  line-height: 100rpx;
  text-align: center;
  font-size: 32rpx;
  color: #333;
  font-weight: bold;
  border-bottom: 1rpx solid #f1f1f1;
}
.agreement-content {
  flex: 1;
  padding: 30rpx;
  font-size: 28rpx;
  color: #333;
}
.agreement-content h3 {
  font-size: 30rpx;
  margin: 30rpx 0 20rpx;
  color: #333;
}
.agreement-content p {
  margin-bottom: 20rpx;
  line-height: 1.6;
}
.agree-btn {
  height: 90rpx;
  line-height: 90rpx;
  text-align: center;
  background-color: #ff2d4a;
  color: #fff;
  font-size: 32rpx;
}
</style>